<extend name="Public:base" />

<block name="additional-styles">
	<!-- DataTables -->
	<link rel="stylesheet" href="__PUBLIC__/Admin/plugins/datatables/dataTables.bootstrap.css" />
</block>

<block name="content-wrapper">
	<!-- Content Wrapper. Contains page content -->
	<div class="content-wrapper">
		<!-- Content Header (Page header) -->
		<section class="content-header">
			<h1>
				学院管理
				<small>Academy Management</small>
			</h1>
			<ol class="breadcrumb">
				<li>
					<a href="__MODULE__/Index/index"> <i class="fa fa-dashboard"></i>
						首页
					</a>
				</li>
				<li class="active">学院管理</li>
			</ol>
		</section>

		<!-- Main content -->
		<section class="content">
			<div class="row">
				<div class="col-xs-12">
					<div class="box">
						<div class="box-header">
							<!-- <h3 class="box-title">Data Table With Full Features</h3>-->
							<div class="row">
								<div class="col-xs-1 pull-right">
									<button type="button" class="btn btn-block btn-primary" data-toggle="modal" data-target="#modal-add">添加</button>
								</div>
							</div>
						</div>
						<!-- /.box-header -->
						<div class="box-body">
							<table id="example1" class="table table-bordered table-striped">
								<thead>
									<tr>
										<th>ID</th>
										<th>学院名称</th>
										<th>操作</th>
									</tr>
								</thead>
								<tbody>
									<volist name="academies" id="vo">
										<tr>
											<td>{$vo.id}</td>
											<td>{$vo.name}</td>
											<td>
												<button class="btn btn-default btn-sm" data-toggle="modal" data-target="#modal-detail" data-whatever="{$vo.id}">详情</button>
												<button class="btn btn-default btn-sm" data-toggle="modal" data-target="#modal-modify" data-whatever="{$vo.id}">修改</button>
												<button class="btn btn-default btn-sm" data-toggle="modal" data-target="#modal-delete" data-whatever="{$vo.id}">删除</button>
											</td>
										</tr>
									</volist>
								</tbody>
								<tfoot>
									<tr>
										<th>ID</th>
										<th>学院名称</th>
										<th>操作</th>
									</tr>
								</tfoot>
							</table>
						</div>
						<!-- /.box-body -->
					</div>
					<!-- /.box -->
				</div>
			</div>
		</section>
		<!-- /.content -->
	</div>
	<!-- /.content-wrapper -->
	<!-- 添加学院 模态框 -->
	<div class="modal" id="modal-add">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">添加学院</h4>
				</div>
				<div class="modal-body">
					<div class="container-fluid">
						<div class="row">
							<form id="form-add" class="form-horizontal" action="__MODULE__/Academy/addPost" method="post">
								<div class="form-group">
									<label class="col-sm-2 control-label">名称</label>
									<div class="col-sm-9">
										<input name="name" id="name" type="text" class="form-control">
									</div>
								</div>
							</form>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button id="button-add-submit"type="button" class="btn btn-primary">确定</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
	<!-- 学院详情 模态框 -->
	<div class="modal" id="modal-detail">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">学院详情</h4>
				</div>
				<div class="modal-body">
					<div class="container-fluid">
						<div class="row">
							<form id="form-detail" class="form-horizontal">
								<div class="form-group">
									<label class="col-sm-2 control-label">名称</label>
									<div class="col-sm-9">
										<input name="name" id="name" type="text" class="form-control" disabled="disabled">
									</div>
								</div>
							</form>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
	<!-- 修改学院 模态框 -->
	<div class="modal" id="modal-modify">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">修改学院</h4>
				</div>
				<div class="modal-body">
					<div class="container-fluid">
						<div class="row">
							<form id="form-modify" class="form-horizontal" action="__MODULE__/Academy/modifyPost" method="post">
								<div class="form-group">
									<label class="col-sm-2 control-label">名称</label>
									<div class="col-sm-9">
										<input name="id" id="id" type="hidden">
										<input name="name" id="name" type="text" class="form-control">
									</div>
								</div>
							</form>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button id="button-modify-submit"type="button" class="btn btn-primary">确定</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
	<!-- 删除学院 模态框 -->
	<div class="modal" id="modal-delete">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">删除学院</h4>
				</div>
				<div class="modal-body">
					<div class="container-fluid">
						<div class="row">
							<form id="form-delete" class="form-horizontal" action="__MODULE__/Academy/deletePost" method="post">
								<div class="form-group">
									<input name="id" id="id" type="hidden">
									<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;确定删除？</p>
								</div>
							</form>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default pull-left" data-dismiss="modal">取消</button>
					<button id="button-delete-submit"type="button" class="btn btn-primary">确定</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>
	<!-- /.modal -->
</block>

<block name="additional-scripts">
	<!-- DataTables -->
	<script src="__PUBLIC__/Admin/plugins/datatables/jquery.dataTables.min.js"></script>
	<script src="__PUBLIC__/Admin/plugins/datatables/dataTables.bootstrap.min.js"></script>
	<script>
		$(function () {
			$("#example1").DataTable();
			$('#example2').DataTable({
				"paging": true,
				"lengthChange": false,
				"searching": false,
				"ordering": true,
				"info": true,
				"autoWidth": false
			});

			// 添加学院
			$('#button-add-submit').click(function() {
	  			var name = $('#modal-add').find('.modal-body #name').val();
				if(name != '') {
					$('#form-add').submit();
				} else {
					alert('名称不能为空！');
				}
			});

			// 学院详情
			$('#modal-detail').on('show.bs.modal', function(event) {
				var button = $(event.relatedTarget);
				var id = button.data('whatever');
				$.post("__MODULE__/Academy/detail",
				{
					id: id
				},
				function(data,status){
		  			$('#modal-detail').find('.modal-body #name').val(data['name']);
				});
			});

			// 修改学院
			$('#modal-modify').on('show.bs.modal', function(event) {
				var button = $(event.relatedTarget);
				var id = button.data('whatever');
				$.post("__MODULE__/Academy/detail",
				{
					id: id
				},
				function(data,status){
					$('#modal-modify').find('.modal-body #id').val(data['id']);
		  			$('#modal-modify').find('.modal-body #name').val(data['name']);
				});
			});
			$('#button-modify-submit').click(function() {
				var name = $('#modal-modify').find('.modal-body #name').val();
				if(name != '') {
					$('#form-modify').submit();
				} else {
					alert('名称不能为空！');
				}
			});

			// 删除学院
			$('#modal-delete').on('show.bs.modal', function(event) {
				var button = $(event.relatedTarget);
				var id = button.data('whatever');
				$('#modal-delete').find('.modal-body #id').val(id);	
			});
			$('#button-delete-submit').click(function() {
				$('#form-delete').submit();
			});
		});
	</script>
</block>